<template>
  <view>
    <Keyword v-if="!searched" v-model="searched" />
		<TabBar v-if="searched" v-model="tabIndex" />
		<DownBar v-if="searched" @searchList="searchList" :categoryLabel="categoryLabel" />
    <!-- 列表组件 -->
    <block v-if="searched">
      <CourseList ref="mescrollItem0" :i="0" :index="tabIndex" :params="params" :content="keyword" />
      <ArticleList ref="mescrollItem1" :i="1" :index="tabIndex" :params="params" :content="keyword" />
      <AnswerList ref="mescrollItem2" :i="2" :index="tabIndex" :params="params" :content="keyword" />
    </block>
  </view>
</template>

<script>
  import Keyword from '@/pages/search/components/keyword'
	import TabBar from '@/components/common/tar-bar'
	import DownBar from '@/components/common/down-bar'
  // 列表组件
  import CourseList from '@/pages/search/components/course-list'
  import ArticleList from '@/pages/search/components/article-list'
  import AnswerList from '@/pages/search/components/answer-list'
  let currentWebView = null
  export default {
	components: {
		Keyword,
		TabBar,
		DownBar,
    CourseList,
    ArticleList,
    AnswerList
	},
    data() {
      return {
        keyword: '',
				tabIndex: 0,
				// 是否搜索，如果是，则隐藏 Keyword 显示 DownBar
				searched: false,
				// 从分类页面传递过来的label
				categoryLabel: null,
        // 搜索参数
        params: {}
      }
    },
    onLoad(options) {
      // #ifdef APP-PLUS
      currentWebView = this.$scope.$getAppWebview()
      // #endif
      console.log('搜索页加载，获取options', options)
      if (options.param) {
				this.searched = true
        this.categoryLabel = JSON.parse(options.param)
        this.handlerSearch()
      } else {
        // 获取焦点
        // #ifdef APP-PLUS
        currentWebView.setTitleNViewSearchInputFocus(true)
        // #endif
      }
      
    },
    /**
     * 监听 右上角 取消事件
     * @param {Object} event
     */
    onNavigationBarButtonTap(event) {
      if (event.index === 0) {
        uni.navigateBack()
      }
    },
    /**
     * 监听原生标题栏搜索输入框输入内容变化事件
     * @param {Object} event
     */
    onNavigationBarSearchInputChanged(event) {
      this.keyword = event.text
    },
    /**
     * 软键盘搜索事件
     */
    onNavigationBarSearchInputConfirmed() {
			if(!this.keyword || !this.keyword.trim()) {
				return false
			}
			this.searched = true
      uni.showToast({
        title: '提示的内容，长度与 icon 取值有关。',
        position:'top'
      })
			const historyList = uni.getStorageSync(this.$_global.SEARCH_HISTORY_LIST) || []
			historyList.unshift(this.keyword)
			uni.setStorage({
				key: this.$_global.SEARCH_HISTORY_LIST,
				data: historyList
			})
			console.log('当前searched：', this.searched)
    },
		methods: {
			/**
			 * 查询列表数据
			 * @param {Object} param
			 */
			searchList(param) {
				uni.showToast({
					title: `查询列表数据，条件为：${param}`,
					position: 'top'
				})
			},
      /**
       * 处理搜索事件
       */
      handlerSearch() {
        this.$nextTick(() =>{
          this.$refs[`mescrollItem${this.tabIndex}`].search()
        })
      }
		}
  }
</script>

<style>
</style>
